<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个人中心</title>
    
    <link rel="stylesheet" href="__STATIC__/web/css/public.css">
    <link rel="stylesheet" href="__STATIC__/web/css/edit_mine.css">
    <link rel="stylesheet" href="__STATIC__/web/css/bui.css">
    <script src="__STATIC__/web/js/rem.js"></script>
    <script src="__STATIC__/web/js/jquery.js"></script>
    <script src="__STATIC__/web/js/bui.js"></script>
    <script src="__PUBLIC__/js/public/jquery-1.11.3.min.js"></script>
    <script src="__PUBLIC__/js/public/bootstrap.min.js"></script>
    <script src="__PUBLIC__/js/layer/layer/layer.js"></script>
    <style>
        html,bdoy{
            overflow-y: scroll;
        }
        .bui-page{
            overflow-y: scroll;
        }
    </style>
</head>

<body>
        <div class="bui-page">
    <main>
            <div class="avatar">
                    <input class="inputfile" id="headImage" type="file">
                    <div class="lt">
                        <span>头像</span>
                        <img id='head_img' src="{$member.head_img}" alt="">
                    </div>
                    <img class="rt" src="__STATIC__/web/img/more.png" alt="">
                </div>
                <div class="username">
                    <span>姓名</span>
                    <input type="text" placeholder="请输入姓名" name="real_name" id="real_name" value="{$member.real_name}">
                </div>

                <div class="tel">
                    <span>联系方式</span>
                    <input type="number" placeholder="请输入联系方式" name="phone"  id="phone" value="{$member.phone}">
                </div>

                <div class="tel">
                    <span>公司</span>
                    <input type="text" placeholder="请输入企业名称"  name="company" id="company" value="{$member.company}">
                </div>

                <div class="submit">
                    <button>保存</button>
                </div>
                <div class="bottom-bar">
                    <div>Copyright©2019 　山东科技大学 </div>
                    <div>鲁ICP备09051012号</div>
                </div>
    </main>

</div>
    <script>
        var imgArray = [];
        var xmlhttp;
        var isClick = true;
        xmlhttp = new XMLHttpRequest();



        $('.submit').click(function () {

            var image = $("#head_img").attr('src')
            var name = $("#real_name").val();
            var phone = $("#phone").val()
            var company = $("#company").val()


            const data = {
                image,
                real_name: name,
                phone,
                company
            }
            console.log(data)
            $.post("{:url('me/saveMember')}", data, function (res) {
                if(res.code == 0){
                   return layer.msg(res.msg)
                    window.location.reload()
                }else{
                    return layer.msg(res.msg)
                }
            });
        })

        function selectImage() {
            $("#headImage").click();
        }

        $("#headImage").change(function () {
            didLoadImage(this);
        });
        function didLoadImage(x) {
            //取出选择的图片
            var fileInput = x.files[0];
            //判断是否选择了图片
            if (x.files && x.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    //此处得到是图片的base64编码数据
                    imagUrl = e.target.result;
                    console.log(e);
                    //展示哪个样式
                    if (imagUrl) {
                        $('#head_img').attr('src', imagUrl);
                    }
                };
                reader.readAsDataURL(x.files[0]);
            }
        }

    </script>

</body>

</html>